Procedural Path Generation

•

This is a little R&D project of mine. The goal was to make a procedurally-generated path using a Bezier spline and a 2D shape.

Hot Wheels Demonstration

The Journey

The first part of this project is understanding how a Bezier spline works (resources will be listed at the footer of this project). After some studying, I was ready to implement them in the project.

Once implementation was finished, I wanted to add scene controls to make modifications to the spline easier to do.

Initial Bezier Spline

After having the base implementation of Bezier splines, my next focus was on being able to determine a path's "UP" direction. This is important for making twisting paths.

My first approach was to add a float value to store the "UP" angle. While this was a valid approach, it was difficult to add scene controls that would make modifying the angle intuitive. The solution was to change my implementation of the Bezier spline. Instead of having separate handle data for each point, I derived the handles' positions from a point's rotation and scale. With this, we can get a path's "UP" from a point's up vector.

Bezier Spline V2

Now that I'm happy with my Bezier implementation, we need a shape to extrude along the spline. For this, I created the Mesh2D class which contains a list of vertices and the index order for the end faces.

Mesh2D Visualization

With the Mesh2D and the spline complete, we can now form our path. We can imagine our Mesh2D as a homeomorphism of a circle. From this, we can generate our path similar to how we would generate a cylinder from a circle.

I also added the "Path Scale" and "Partition" fields to modify the path further.

Base Path Generation

We have our paths! Now we just have to dress them up with textures. To do so, I added a "UV X" field to the Mesh2D's vertex data. This will determine a vertex's mapping along the texture's x-axis and the y-axis mapping will be derived from the distance between points.

Initial UV Calculations

The UV calculations are almost done. I experimented with a Hot Wheels track texture and noticed that the UVs were wrong when the arrows weren't showing up. I realized that I wasn't properly calculating the UV Y coordinates based on each adjacent points' distances. This can be seen in the video above where the UVs would change when I play around with the Partitions field.

I went through my code again and fixed the bug. Now our UVs will stay the same regardless of mesh partition count.

Proper UV Calculations

Wonderful! We've completed our procedural path. I decided to go further and added the ability to track an object along the spline.

Spline Object Tracking

I also added different modes for tracking a spline:

1. Spline Interpolation - Interpolation along the spline's points

2. Normalized Interpolation - Interpolation between the spline's start and end points

Spline Tracking Modes

Lastly, I added interspline tracking and a neat button to automatically connect the splines by their start and end points.

Interspline Tracking + Connection

That's all for Procedural Path Generation journey. If you have any questions, please feel free to comment on this project.

Thank you and have a good one! :)